<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@include file="/WEB-INF/system/include/common.jsp"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>流程部署</title>
<link rel="stylesheet" type="text/css" href="${jsAndCss}/css/style.css" />
<link rel="stylesheet" type="text/css"
	href="${jsAndCss}/css/WdatePicker.css" />
<link rel="stylesheet" type="text/css"
	href="${jsAndCss}/css/skin_/table.css" />
<link rel="stylesheet" type="text/css"
	href="${jsAndCss}/css/jquery.grid.css" />
</head>
<body>
	<div id="container" style="position: relative;">
		<div id="hd"></div>
		<div id="bd">
			<div id="main">
				<div class="search-box ue-clear">
					<div class="search-area">
						<div class="kv-item ue-clear">
							<label>选择时间：</label>
							<div class="kv-item-content ue-clear">
								<span class="choose"> <span class="checkboxouter">
										<input type="radio" name="time" /> <span class="radio"></span>
								</span> <span class="text">全部</span>
								</span> <span class="choose"> <span class="checkboxouter">
										<input type="radio" name="time" /> <span class="radio"></span>
								</span> <span class="text">近3天</span>
								</span> <span class="choose"> <span class="checkboxouter">
										<input type="radio" name="time" /> <span class="radio"></span>
								</span> <span class="text">近一周</span>
								</span> <span class="choose"> <span class="checkboxouter">
										<input type="radio" name="time" /> <span class="radio"></span>
								</span> <span class="text">近一月</span>
								</span> <span class="choose"> <span class="checkboxouter">
										<input type="radio" name="time" data-define="define" /> <span
										class="radio"></span>
								</span> <span class="text">自定义</span>
								</span> <span class="define-input"> <input type="text"
									placeholder="开始时间" /> <span class="division"></span> <input
									type="text" placeholder="结束时间" />
								</span>
							</div>
						</div>
						<div class="kv-item ue-clear">
							<label>选择类型:</label>
							<div class="kv-item-content">
								<select>
									<option>全部</option>
									<option>全部</option>
									<option>全部</option>
								</select>
							</div>
						</div>
					</div>
					<div class="search-button">
						<input class="button" type="button" value="搜索一下" /> <a
							href="${ctx}/apply/handleIndex"><input class="button"
							type="button" value="返回上一页" /></a>
					</div>
				</div>

				<div class="table">
					<div class="opt ue-clear">
						<span class="sortarea"> <span class="sort"> <label>排序：</label>
								<span class="name"> <i class="icon"></i> <span
									class="text">名称</span>
							</span>
						</span> <i class="list"></i> <i class="card"></i>
						</span> <span class="optarea"> <a href="javascript:;" class="add">
								<i class="icon"></i> <span class="text">添加</span>
						</a> <a href="javascript:;" class="delete"> <i class="icon"></i> <span
								class="text">删除</span>
						</a> <a href="javascript:;" class="statistics"> <i class="icon"></i>
								<span class="text">统计</span>
						</a> <a href="javascript:;" class="config"> <i class="icon"></i> <span
								class="text">配置</span>
						</a>
						</span>
					</div>
					<div class="grid"></div>
					<div class="pagination" id="paging"></div>
					<span class="kv-item-tip error" style="">${msg }</span>
					<div id="imgWindowBox"
						style="position: absolute; top: 0px; left: 200px; width: 700px; display: none; background-color: white; z-index: 99; box-shadow: 0px 0px 5px #999">
						<div id="close"
							style="position: absolute; top: 10px; right: 15px; font-size: 18px; z-index: 100">X</div>
						<div id="imgWindow"></div>
					</div>

				</div>
			</div>
		</div>
	</div>
</body>
<script type="text/javascript" src="${jsAndCss}/js/jquery.js"></script>
<script type="text/javascript" src="${jsAndCss}/js/global.js"></script>
<script type="text/javascript" src="${jsAndCss}/js/jquery.select.js"></script>
<script type="text/javascript" src="${jsAndCss}/js/core.js"></script>
<script type="text/javascript" src="${jsAndCss}/js/jquery.pagination.js"></script>
<script type="text/javascript" src="${jsAndCss}/js/jquery.grid.js"></script>
<script type="text/javascript" src="${jsAndCss}/js/WdatePicker.js"></script>
<script type="text/javascript">
	var listMgr = {
		/* test:function(){
			
			alert($("option:selected",$("#pageSize")).val());
		}, */
		getList : function(pageNum, pageSize) {
			var tempPageSize = $("option:selected", $("#pageSize")).val();
			if (null != tempPageSize) {
				pageSize = tempPageSize;
			}
			var urlStr = "${ctx}/accountListRe";
			listMgr.getListPage(pageNum, pageSize, urlStr);
		},

		getListPage : function(pageNum, pageSize, urlStr) {
			$
					.ajax({
						type : 'post',
						url : urlStr,
						dataType : 'json',
						data : {
							"pageNum" : pageNum,
							"pageSize" : pageSize
						},
						success : function(data) {
							console.log(data.pageStr);
							console.log(data.resList);
							var pageNum = data.resList.length;

							$("#close").click(function() {
								$("#imgWindowBox").hide();
							});

							$('select').select();
							/* var head = [ {
								label : 'ID',
								width : 100,
								sortable : 'default',
								name : 'ID'
							}, {
								label : '请假人',
								width : 150,
								sortable : 'default',
								name : 'name'
							}, {
								label : '昵称',
								width : 150
							} ];  */

							var oper = [ {
								label : "<a href='/ims/apply/leaveHandle'>审批</a>",
								onclick : function() {
									alert("gg");

								}
							} ];
							var tbody=[ [ "201301", "admin", "熊猫王子", oper ] ]; 

							/* $('.grid').Grid({
								thead : head,
								tbody : null,
								height : 200,
								checkbox : {
									single : true
								},
								operator : {
									type : "normal",
									width : 100
								},
								sortCallBack : function(name, index, type) {
									alert(name + "," + index + ',' + type);
								}

							}); */

							$('.grid').Grid({
								thead : head,
								tbody : null,
								height : 37 * pageNum + 5,
								checkbox : {
									single : true
								},
								operator : {
									type : "normal",
									width : 100
								},
								sortCallBack : function(name, index, type) {
									alert(name + "," + index + ',' + type);
								}
							});

							$('.grid').Grid('addLoading');

							$('.search-box input[type=radio]')
									.click(
											function(e) {
												if ($(this).prop('checked')) {
													if ($(this).attr(
															'data-define') === 'define') {
														$('.define-input')
																.show();
													} else {
														$('.define-input')
																.hide();
													}
												}
											});

							$('#paging').html(data.pageStr);

							var head = [ {
								label : 'ID',
								width : 100,
								sortable : 'default',
								name : 'ID'
							}, {
								label : '登录名',
								width : 200,
								sortable : 'default',
								name : '登录名'
							}, {
								label : '更新人',
								width : 50,
								sortable : 'default',
								name : '更新人'
							}, {
								label : '更新日期',
								width : 200,
								sortable : 'default',
								name : '更新日期'
							}, {
								label : 'del_flag',
								width : 200,
								sortable : 'default',
								name : 'del_flag'
							}, {
								label : '状态',
								width : 50,
								sortable : 'default',
								name : '状态'
							}

							];

							// 模拟异步
							setTimeout(function() {
								$('.grid').Grid('setData', tbody, head);
							}, 100)
							var leaveState;

							$.each(
											data.resList,
											function(i, n) {
												oper = [
														{
															label : "修改",
															onclick : function() {
																$.ajax({
																			type : "post",
																			url : "/ims/deployRep/leaveProcessImg2?userId="
																					+ n.userId,
																			success : function(
																					data) {
																				$(
																						"#imgWindow")
																						.html(
																								data);
																				$(
																						"#imgWindowBox")
																						.show();

																			}
																		});
															}
														},
														{
															label : "<a href='${ctx}/delAccount?accountId="
																	+ n.accountId
																	+ "'>删除</a>",
															onclick : function() {
																alert(gg);
															}
														} ];
												/* switch(n.leaveState)
												{
												case 0: 
													leaveState="未提交";
													break;
												case 1:
													leaveState="审核中";
													break;
												case 2:
													leaveState="已批准";
													break;
												case null:
													leaveState="异常";
													break;
												default:
													leaveState="默认";
												    break;	
												} */

												tbody[i] = [ n.accountId,
														n.loginName,
														n.updateBy,
														n.updateDate,
														n.delFlag, "empty",
														oper ]
											});

						}
					});
		}
	}
	$(function() {
		console.log("我执行了！");
		listMgr.getList(1, 10);
	});
</script>